<style scoped lang="scss">
.bigBox {
  width: 100vw; // 100vw * 0.5 = 50vw
  height: 100vh; // 100vh * 0.5 = 50vh
  background-color: #f2f2f2;
  display: flex;
  flex-direction: column;

  header {
    width: 100%;
    height: 50px; // 100px * 0.5 = 50px
    margin-bottom: 5px; // 10px * 0.5 = 5px
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;

   .header-left {
      margin-left: 20px; // 20px * 0.5 = 10px
    }

   .header-center {
      margin-right: 10px; // 20px * 0.5 = 10px

      p {
        font-size: 13px; // 26px * 0.5 = 13px
      }
    }
  }

  main {
    width: 100%;
    flex: 1;
    background-color: #fff;
    padding-left: 20px; // 40px * 0.5 = 20px
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    p {
      font-size: 12.5px; // 25px * 0.5 = 12.5px
      color: #4a4949;
    }
  }
}
</style>

<template>
  <div class="bigBox">
    <header>
      <div class="header-left">
        <van-icon style="font-size: 30px" name="arrow-left" @click="onClickLeft" />
      </div>
      <div class="header-center">
        <p>版本检测</p>
      </div>
      <div class="header-right"></div>
    </header>
    <main>
      <p>已是最新版本</p>
    </main>
  </div>
</template>

<script setup lang="ts">
import router from '@/router'

const onClickLeft = () => history.back()
const onRest = () => {
  router.push('/setting')
}
</script>
